<template>
  <view>
    <u-navbar title="处罚标准" autoBack fixed placeholder></u-navbar>
    <view class="content">
      <view class="tips">
        Tips：违规行为中【】内对应发帖规范【】内级别
      </view>
      <view class="table">
        <view class="tr">
          <view class="td">违规行为</view>
          <view class="td">违反次数</view>
          <view class="td">处罚方式</view>
        </view>
        <view class="tr">
          <view class="td">【低】</view>
          <view class="td">1次</view>
          <view class="td">警告</view>
        </view>
        <view class="tr">
          <view class="td">【低】</view>
          <view class="td">5次及以上</view>
          <view class="td">封号(时长视情况而定)</view>
        </view>
        <view class="tr">
          <view class="td">【中】</view>
          <view class="td">1次</view>
          <view class="td">封号(时长视情况而定)</view>
        </view>
        <view class="tr">
          <view class="td">【中】</view>
          <view class="td">3次及以上</view>
          <view class="td">封号，并上报学校</view>
        </view>
        <view class="tr">
          <view class="td">【重】</view>
          <view class="td">3次及以上</view>
          <view class="td">封号，并上报学校</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  components: {},
  data() {
    return {}
  },
} 
</script>

<style scoped lang="scss">
.content {
  padding: 15px 10px;
  background-color: #ffffff;
  box-sizing: border-box;

  .tips {
    padding-top: 10px;
    color: #ff1100;
  }

  .table {
    margin-top: 20px;
    border-top: 1px solid #eeeeee;
  }

  .tr {
    display: flex;
    align-items: center;
    border-left: 1px solid #eeeeee;

    .td {
      width: 100%;
      padding: 5px 0;
      text-align: center;
      border: 1px solid #eeeeee;
      border-top: none;
      border-left: none;
    }

    .td:first-child {
      width: 50%;
    }

    .td:nth-child(2) {
      width: 60%;
    }
  }
}
</style>